CSSの基本（9）−背景画像の繰り返しを指定する
通常、背景に指定した画像は、縦横に繰り返し表示されます。CSSには、この繰り返しを制御するためのプロパティも用意されています。今回の講座では、背景画像の繰り返しを制御するbackground-repeatプロパティの使い方を解説します。

→ 背景画像の繰り返しを禁止する
 
背景画像を縦横に繰り返さずに1回だけ表示させる場合は、background-repeatプロパティを利用し、その値に「no-repeat」を指定します。ここでは、以下のような画像をホームページ全体の背景画像に指定し、「background-repeat:no-repeat」で繰り返しを禁止した場合の例を紹介しておきます。そのほか、このCSSでは背景色を黒色に指定しています（文字色が白色であるため）。
<STYLE type="text/css">
BODY{
    background-color:#000000;
    background-image:url(back.jpg);
    background-repeat:no-repeat;
}
    ：
    ：
</STYLE>		 サンプルページ


→ 背景画像を縦方向だけに繰り返す
 
background-repeatプロパティでは、背景画像を縦方向だけに繰り返す指定も行えます。この場合は、値に「repeat-y」を記述してください。先ほどと同じ例を「background-repeat:repeat-y」に変更すると、サンプルのような表示になります。
<STYLE type="text/css">
BODY{
    background-color:#000000;
    background-image:url(back.jpg);
    background-repeat:repeat-y;
}
    ：
    ：
</STYLE>		 サンプルページ


→ 背景画像を横方向だけに繰り返す
 
同様に、背景画像を横方向だけに繰り返す場合は、background-repeatプロパティの値に「repeat-x」を指定します。なお、今回はBODYタグに対して背景画像の指定を行いましたが、DIVタグやPタグ、TABLEタグでも同様の指定を行うことが可能です。この場合、ブロックや段落、表組みの内部に背景画像が表示され、繰り返し表示が制御されます。
<STYLE type="text/css">
BODY{
    background-color:#000000;
    background-image:url(back.jpg);
    background-repeat:repeat-x;
}
    ：
    ：
</STYLE>		 サンプルページ


G�|�C���g�|�C���@Amazon Yahoo �y�V

�����z�[���y�[�W �y�V���o�C��[UNLIMIT��������1�~] �C�O�i���q���� �C�O���s�����������I